<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<head>
  <meta charset="UTF-8">
  <title>v-if</title>
</head>
<body>
<div id="app">
<input type="submit" value="切换显示" @click="thoggleIsShow">
  <p v-if="isShow">黑马程序员</p>
  <p v-show="isShow">黑马程序员 --v-show修饰</p>
<!--  区别：v-if性能消耗稍大，v-if是直接删除dom-->
</div>
<script>
  var app = new Vue({
    el:"#app",
    data:{
      isShow:false
    },
    methods:{
      thoggleIsShow:function () {
        this.isShow=!this.isShow;
      }
    }
  })
</script>
</body>
</html>
